<template>
	<view>
		<view class="main">
			<view class="tou12">
				<view class="t_12">
					<!-- <view class="item_head">
						HTML
					</view> -->
					<view style="height: 100%;">
						<view class="teitel2">
							大阶段：
							<el-select @change='chende' v-model="value" placeholder="请选择阶段">
								<el-option v-for="item in options" :key="item.label" :label="item.label"
									:value="item.label">
								</el-option>
							</el-select>
						</view>
					</view>
					<view style="height: 100%;">
						<view class="teitel2">
							阶段分类：
							<el-select @change='chende1' v-model="value1" placeholder="请选择阶段">
								<el-option v-for="item in options1" :key="item.videocate" :label="item.videocate"
									:value="item.videocate">
								</el-option>
							</el-select>

						</view>
					</view>
					<view class="" style="height: 100%;">
						<view class="teitel2">
							阶段课程：
							<!-- 课程 -->
							<el-select @change='chende2' v-model="value2" placeholder="请选择阶段">
								<el-option v-for="item in options2" :key="item.erjicate" :label="item.erjicate"
									:value="item.erjicate">
								</el-option>
							</el-select>
						</view>
					</view>

				</view>
			</view>
			<view class="">
				课程任务
			</view>
			<view style="display: flex;justify-content: space-around;">
				<el-input type="textarea" placeholder="请输入内容" v-model="textarea2">
				</el-input>
				<el-button style="margin-left: 6vw;" @click="sunblie" type="primary">确认</el-button>
			</view>
		</view>
		<view style="display: flex;justify-content: space-around;">
			<view class="border_up" @click="upload212()">
				<image style="width: 60px;height: 60px;"
					src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-0e81782d-dd8f-4ba7-90bb-b62e4fa43b58/ecc53218-fbb2-40d7-87d0-7d0dd635d696.png"
					mode=""></image>
				<view class="te22">
					点击上传
				</view>
			</view>
			<view>
				<view class="">
					设置二级分类的资源下载为你填写的链接
				</view>
				<el-input v-model="ttename" placeholder="文件名称"></el-input>
				<el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="urldata">
				</el-input>
				<el-button @click="setbaidurldata()" style="margin-top: 20px;" size="small" type="primary">确认
				</el-button>
			</view>
		</view>
		<view style="display: flex;margin: 3vw 5vw;">
			<view class="">
				<el-input v-model="titllr" placeholder="标题"></el-input>
				<el-input style="margin: 3vw 0vw;" v-model="typp" placeholder="0为通知1为推荐2为资料"></el-input>
				<el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="typp23">
				</el-input>
				<el-button @click="mesaageok" style="margin-top: 20px;" size="small" type="primary">确认</el-button>
			</view>
		</view>
		<view class="" style="margin: 2vw 5vw;">
			<view class="" style="margin: 1vw 0vw;display: flex;">
				<el-button @click="getzuoye()" size="mini" type="primary">作业</el-button>
				<el-button @click="getbiji()" size="mini" type="primary">笔记</el-button>
			</view>
			<el-table :data="zuoyedata" v-loading="loadin33" height="320" style="width: 100%;">
				<el-table-column prop="namefile" label="名称" align="center">
				</el-table-column>
				<el-table-column label="上传时间" align="center">
					<template slot-scope="scope">
						{{formatDate(scope.row.date-0)}}
					</template>
				</el-table-column>
				<el-table-column label="评分" width="250" align="center">
					<template slot-scope="scope">
						<el-input v-model="scope.row.pingfen" placeholder="请输入内容"></el-input>
					</template>
				</el-table-column>
				<el-table-column label="操作" width="250" align="center">
					<template slot-scope="scope">
						<el-button @click="querenbianij(scope.row)" size="mini" type="primary">确认</el-button>
					</template>
				</el-table-column>
			</el-table>
			<el-button @click="gozhuce()" size="mini" type="primary">去注册</el-button>
		</view>
		<view class="" style="margin: 2vw 5vw;">
			<input type="text" value="" v-model="ceshisousuo" />
			<el-button @click="okceshi()" size="mini" type="primary">确认</el-button>
		</view>
	</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				ceshisousuo: '',
				loadin33: false,
				inputbianji: '',
				mun: 0,
				activeIndex: '4',
				options: [{
					label: '第一阶段'
				}, {
					label: '第二阶段'
				}, {
					label: '第三阶段'
				}],
				sqltext: '',
				value: '第一阶段',
				options1: [],
				value1: '',
				options2: [],
				value2: '',
				// 课程信息
				classlist: [],
				textarea2: '',
				userid: '',
				urldata: '',
				ttename: '',
				typp: '',
				typp23: '',
				titllr: '',
				zuoyedata: []
			};
		},
		async onLoad() {
			if (uni.getStorageSync('userpro')) {
				this.userid = uni.getStorageSync('uni_id')
				let data = uni.getStorageSync('userpro')
				this.setsql(data.jieduan)
				this.getcate(this.sqltext)
				this.chende1(data.fenlei)
				this.getlist(data.kecheng)
				this.value = data.jieduan
				this.value1 = data.fenlei
				this.value2 = data.kecheng

			}
			// this.update2()
		},
		methods: {
			querenbianij(item) {
				console.log(item);
				this.uploadpin(item._id, item.pingfen)
			},
			gozhuce() {
				uni.navigateTo({
					url: '../zhuce/zhuce'
				})
			},
			async okceshi() {
				const db = uniCloud.database();
				let collection = db.collection('ajno_kec_list')
				let res = await collection.where({
					videocate: this.value1
				}).limit(400).get({
					getCount: true
				})
				let min = 0
				let miao = 0
				for (let i = 0; i < res.result.data.length; i++) {
					let arr = res.result.data[i].videodate.split(':')
					min += parseInt(arr[0])
					miao += parseInt(arr[1])

				}
				let fenu = (miao / 60).toFixed(0)
				let a = min + parseInt(fenu)
				let b = ((min + parseInt(fenu)) / 60).toFixed(2)
				console.log(res);
				console.log(`(${res.result.affectedDocs}集 ${a}m ${b}h)`);
			},
			// 更新评分
			async uploadpin(id, pinfen) {
				const db = uniCloud.database();
				let collection = db.collection('zuoyefile')
				let res = await collection.where({
					_id: id
				}).update({
					pingfen: pinfen
				})
				if (res.result.code === 0) {
					console.log(res);
					this.$message.success('成功')
				} else {
					this.$message.error('请求失败')
				}
			},
			async getzuoye() {
				this.loadin33 = true
				const db = uniCloud.database();
				let collection = db.collection('zuoyefile')
				let res = await collection.where({
					ercate: this.value2,
					isbiji: '0',
					ifcursezuoye: '0'
				}).get()
				if (res.result.code === 0) {
					console.log(res);
					this.zuoyedata = res.result.data
				} else {
					this.$message.error('请求失败')
				}
				this.loadin33 = false
			},
			// 获取笔记
			async getbiji() {
				this.loadin33 = true
				const db = uniCloud.database();
				let collection = db.collection('zuoyefile')
				let res = await collection.where({
					ercate: this.value2,
					isbiji: '1',
					ifcursezuoye: '0'
				}).get()
				if (res.result.code === 0) {
					this.zuoyedata = res.result.data
				} else {
					this.$message.error('请求失败')
				}
				this.loadin33 = false
			},
			upload212() {
				let that = this
				uni.chooseFile({
					count: 6, //默认100
					extension: ['.zip', '.doc', '.docx', '.pdf'],
					success: function(res) {
						if (res.tempFiles[0].size > 5242880) {
							that.$message.error('文件大小不能超过5M')
							return
						}
						that.isupload = true
						console.log(res);
						let filePath = res.tempFilePaths[0]
						let textname = res.tempFiles[0].name
						let text = +new Date() + res.tempFiles[0].name
						uniCloud.uploadFile({
							filePath: filePath,
							cloudPath: text,
							complete: res => {
								that.isupload = false
								console.log(res.fileID);
								that.setfile(res.fileID, textname)
							}
						});

					}
				});
			},
			async setfile(url, name) {
				const db = uniCloud.database();
				let collection = db.collection('zuoyefile')
				let res = await collection.add({
					userid: this.userid,
					ercate: this.value2,
					fileid: url,
					namefile: name,
					type: '0',
					ifcursezuoye: '1'
				})
				if (res.result.code === 0) {
					this.$message.success('成功！')
				}
			},
			async setbaidurldata() {
				const db = uniCloud.database();
				let collection = db.collection('zuoyefile')
				let res = await collection.add({
					userid: this.userid,
					ercate: this.value2,
					urldata: this.urldata,
					namefile: this.ttename,
					type: '1',
					ifcursezuoye: '1'
				})
				if (res.result.code === 0) {
					this.$message.success('成功！')
				}
			},
			async sergcontet() {
				const db = uniCloud.database();
				let collection = db.collection('contents')
				let res = await collection.where("okercate=='" + this.value2 + "'").get()
				if (res.result.affectedDocs != 0) {
					this.textarea2 = res.result.data[0].content
				} else {
					this.textarea2 = ''
				}
			},
			async sunblie() {
				const db = uniCloud.database();
				let collection = db.collection('contents')
				let res = await collection.where("okercate=='" + this.value2 + "'").get()
				console.log(res);
				if (res.result.affectedDocs === 0) {
					let res1 = await collection.add({
						content: this.textarea2,
						okercate: this.value2,
					})
					if (res1.result.code === 0) {
						this.$message.success('addok!')
					}
				} else {
					let res2 = await collection.where("okercate=='" + this.value2 + "'").update({
						content: this.textarea2,
					})
					if (res2.result.code === 0) {
						this.$message.success('updateok!')
					}
				}

			},
			async update2() {
				const db = uniCloud.database();
				let collection = db.collection("js_kec_list")
				let res = await collection.where("videocate=='1_[object Object]_JS基础语法'").update({
					videocate: '1_JS基础语法',
				})
			},
			setsql(val) {
				if (val === "第一阶段") {
					this.sqltext = 'hc_kec_list'
				} else if (val === "第二阶段") {
					this.sqltext = 'js_kec_list'
				} else if (val === "第三阶段") {
					this.sqltext = 'ajno_kec_list'
				}
			},
			navageto(id) {
				if (id === '2') {
					uni.navigateTo({
						url: '../upload/upload'
					})
				} else if (id === '1') {
					uni.navigateTo({
						url: '../home'
					})
				} else if (id === '3') {
					uni.navigateTo({
						url: '../message/message'
					})
				}
			},
			chende(val) {
				if (val === "第一阶段") {
					this.sqltext = 'hc_kec_list'
					this.getcate(this.sqltext)
					this.value1 = ''
					this.value2 = ''
					this.options2 = []
				} else if (val === "第二阶段") {
					this.sqltext = 'js_kec_list'
					this.getcate(this.sqltext)
					this.value1 = ''
					this.value2 = ''
					this.options2 = []
				} else if (val === "第三阶段") {
					this.sqltext = 'ajno_kec_list'
					this.getcate(this.sqltext)
					this.value1 = ''
					this.value2 = ''
					this.options2 = []
				}
			},
			chende1(val) {
				console.log(val);
				this.getclass(val)
				this.value2 = ''
			},
			chende2(val) {
				this.mun++
				this.mun = this.mun > 9 ? this.mun : '0' + this.mun
				console.log(val);
				this.getlist(val)
			},
			async getcate(val) {
				const db = uniCloud.database()
				let res = await db.collection(val).groupBy('videocate').orderBy('videocate').get()
				this.options1 = res.result.data
			},
			async getclass(val) {
				const db = uniCloud.database()
				let res = await db.collection(this.sqltext).where('videocate=="' + val + '"').groupBy('erjicate')
					.orderBy('erjicate').get()
				this.options2 = res.result.data
			},
			async getlist(val) {
				this.sergcontet()
				const db = uniCloud.database()
				let res = await db.collection(this.sqltext).where('erjicate=="' + val + '"').orderBy('videosort').get()
				console.log(res);
				this.classlist = res.result.data
			},
			async mesaageok() {
				let data2 = +new Date()
				const db = uniCloud.database()
				let res = await db.collection('xiaoxi').add({
					message: this.typp23,
					type: this.typp - 0,
					data: data2 + '',
					title: this.titllr
				})
				if (res.result.code === 0) {
					this.$message.success('成功！')
				} else {
					this.$message.error('失败')
				}
			},

		}
	}
</script>

<style lang="scss">
	* {
		box-sizing: border-box;
	}

	.top1 {
		width: 100%;
		height: 60px;
		background-color: #545c64;
		display: flex;
		padding-bottom: 3px;
		padding: 0px 100px;
	}

	.item1 {
		width: 70px;
		height: 60px;
		text-align: center;
		line-height: 60px;
		color: #fff;
		margin-right: 20px;
		cursor: pointer;
	}

	.active {
		color: #ffd04b;
		border-bottom: 3px solid #ffd04b;
	}

	.main {
		padding: 20px 100px;
		width: 100%;
		background-color: #fff;
	}

	body {
		perspective: 500px;
	}

	.tou12 {
		display: flex;
		justify-content: space-between;
	}

	.t_12 {
		width: 100%;
		height: 60px;
		background-color: #fff;
		position: relative;
		margin: auto;
		display: flex;
		justify-content: space-around;
		align-items: center;
		text-align: center;
	}

	.you12 {
		width: 60%;
		text-align: center;
	}

	.zuo21 {
		width: 30%;
	}

	.t_34 {
		width: 30%;
		height: 160px;
		line-height: 160px;
		background-color: #fff;
	}

	.border_up {
		width: 400px;
		height: 200px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		border: 1px dashed #ccc;
		border-radius: 10px;
		cursor: pointer;
	}

	.te22 {
		color: #ccc;
	}

	.border_up:hover {
		border: 1px dashed #60a9ff;
	}

	.border_up:hover .te22 {
		color: #60a9ff;
	}

	.item_head {
		position: absolute;
		top: -5px;
		left: -10px;
		margin: auto;
		font-size: 30px;
		transform-style: preserve-3d;
		transition: all 2s;
		text-align: center;
		width: 150px;
		height: 150px;
		line-height: 150px;
		background-color: #ff557f;
		border-radius: 50%;
		color: #fff;
		box-shadow: 1px 2px 4px 1px rgba(0, 0, 0, 0.4);
	}

	.item_head:hover {
		transform: translateY(-10px) rotateY(360deg);
	}

	.item_body {
		margin: auto;
		width: 50vw;
		background-color: #f4f4f4;
		margin-top: 35px;
		overflow: hidden;
		overflow: auto;
	}

	.mt2 {
		height: 150px;
		width: 70%;
		display: flex;
		overflow: hidden;
		overflow-x: auto;
	}

	.clearfloat:after {
		display: block;
		clear: both;
		content: "";
		visibility: hidden;
		height: 0
	}

	.clearfloat {
		zoom: 1
	}

	.box {
		display: inline-block;
		position: relative;
		width: 158px;
		height: 60px;
		transform-style: preserve-3d;
		transition: all .4s;
		margin: 1.5vw 10px;
	}

	.box:hover {
		transform: rotateX(90deg);
	}

	.front,
	.bottom {
		font-size: 18px;
		text-align: center;
		line-height: 60px;
		color: #fff;
	}

	.front {

		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #00ae9d;
		/* transform: rotateX(90deg) translateY(20px); */
		transform: translateY(30px) rotateX(-90deg);
	}

	.bottom {

		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #78cdd1;
		transform: translateZ(30px);
	}

	.t_34 {
		background-color: #f4f4f4;
		text-align: center;
	}

	.bunok {
		margin: auto;
		width: 200px;
		height: 100px;
		line-height: 100px;
		background-color: #35deff;
		color: #fff;
	}

	.teitel2 {
		font-weight: bold;
		font-size: 20px;
	}
</style>
